import React from "react";
import Reflux from "reflux";
import {LdhDetailForm, LdhDetailPage} from "@biz/PageCompnents";
import {Message} from "@biz/Components";
import GUtils from "@/utils";
import {Modal} from "antd";
import {LdhButton, LdhForm} from "./Components";


export default class BaseModal extends React.Component {


    constructor(props) {
        super(props);
        this.okLabel="保存";
        this.cancelLabel="取消";
        this.title = "";
        this.formRef = React.createRef();
        this.noOp = false;
        this.width=600;

        this.handleSubmit = this.handleSubmit.bind(this);
        this.onCancel = this.onCancel.bind(this);
    }
    onCancel(){
        let {action} = this.props;
        action.cancel();
    }

    componentWillReceiveProps(nextProps, nextContext) {
        let {modalStatus} = nextProps.store;
        if(modalStatus && modalStatus==this.visibleStatus && modalStatus!=this.props.store.modalStatus){
            this.onVisible(nextProps);
        }
        if(this.noOp) return;

        let {getDetailCompleted, detail,} = nextProps.store;
        if(getDetailCompleted && !this.props.store.getDetailCompleted){
            this.form().setFieldsValue(detail);

            this.onGetDetailCompleted(detail);
        }

    }
    onVisible(nextProps){

    }
    // 子类可以自定义，当获取到详情成功时的逻辑
    onGetDetailCompleted(detail){

    }

    handleSubmit(){
        this.form().validateFields()
            .then(values=>{
                this.onSubmit(values);
            })
            .catch((e)=>{});
    }

    // 子类可以自定义，当提交时的逻辑
    onSubmit(values){

    }
    form() {
        return this.formRef.current;
    }


    // 子组件完善此方法，展示具体的数据
    renderDetail(){
        return <div></div>
    }
    render() {
        let {store, } = this.props;
        let {detailLoading, detailStatus, detail, modalStatus} = store;
        let isOpen = modalStatus==this.visibleStatus || detailStatus == this.visibleStatus;

        return  <Modal title={this.title} loading={detailLoading} open={isOpen}
                       onOk={this.handleSubmit.bind(this)}  destroyOnClose
                       onCancel={this.onCancel.bind(this)} width={ this.width}
                       footer={[
                           <LdhButton key="back" onClick={this.onCancel.bind(this)}>{this.cancelLabel}</LdhButton>,
                           <LdhButton key="submit" onClick={this.handleSubmit.bind(this)} loading={detailLoading} type="primary">{this.okLabel}</LdhButton>
                       ]}>
            <LdhForm ref={this.formRef}  labelWidth="100px" layout="horizontal"  initialValues={detail} className={this.className} preserve={false}>

                {this.renderDetail()}
            </LdhForm>

    </Modal>
    }
}